<template>
  <PageContainer>
    <view class="container">
      <Header title="合作详情" :is-go-back="true" :is-box-shadow="false" />
      <CoopStep
        v-if="details"
        :logo="details?.logo"
        :name="details?.orgName"
        :ap-status="details?.apStatus"
      />

      <view class="bgf mt-15">
        <view class="linh-44 px-15 fz-15 fw-7 borderBottom">申请信息</view>
        <view class="mx-15 py-10">
          <view class="cellBox ov-1">合作申请方：{{ details?.apOrgName }}</view>
          <view class="cellBox ov-1">合作接收方：{{ details?.orgName }}</view>
          <view class="cellBox ov-1">申请人：{{ details?.createUser ?? '' }}</view>
          <view class="cellBox ov-1">申请时间：{{ details?.createTime }}</view>
        </view>
      </view>

      <TButtonGroup v-if="details && getStep?.confirmText" :styles="{ backgroundColor: '#FFFFFF' }">
        <template #header>
          <view class="slotBox" @click.stop="callPhone">
            <view>
              <text class="ali-icon fz-20">&#xe68b;</text>
            </view>
            <view class="fz-12">联系秘书处</view>
          </view>
        </template>
        <TButton
          v-if="getStep.cancelText"
          class="gutter-btn"
          :text="getStep.cancelText"
          type="none"
          custom-class="coopClose"
          @click="getStep.cancelFnc"
        />
        <TButton
          class="gutter-btn"
          :text="getStep.confirmText"
          type="primary"
          @click="getStep.confirmFnc"
        />
      </TButtonGroup>

      <ShowModal
        v-model="confirmVisible"
        :title="'确认' + (params.apStatus === AuditStatusEnum.REJECT ? '驳回' : '合作')"
        @confirm="submit"
      >
        <template #content>
          <view
            class="ma-15 px-15 py-7"
            style="width: 100%; background: #f5f5f5; border-radius: 10rpx"
          >
            <UniEasyinput
              type="textarea"
              :inputBorder="false"
              placeholder="（非必填）请输入审核原因"
              v-model="params.apText"
            />
          </view>
        </template>
      </ShowModal>
      <ShowModal
        v-model="closeVisible"
        :content="'确认' + getStep?.confirmText + '?'"
        @confirm="submit"
      ></ShowModal>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* cooperationInvitationDetail 合作详情 */
  import {
    addCooperationInvitation,
    cooperationInvitationAudit,
    getCooperationInvitationDetail,
  } from '@/api/cooperation';
  import type { DetailsInfo } from '@/api/cooperation/types';
  import Header from '@/components/Header/index.vue';
  import PageContainer from '@/components/PageContainer/index.vue';
  import { onLoad, redirectTo } from '@/router';
  import { computed, ref, reactive } from 'vue';
  import CoopStep from '../cooperationDetails/components/coopStep.vue';
  import { ApplyTypeEnum, AuditStatusEnum, TabsListValueEnum } from '@/enums/cooperationEnum';
  import TButtonGroup from '@/components/TButtonGroup/index.vue';
  import TButton from '@/components/TButtonGroup/TButton.vue';
  import ShowModal from '@/components/ShowModal/index.vue';
  import UniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';

  const id = ref<number>();
  const params = reactive({
    apStatus: AuditStatusEnum.UNREVIEWED,
    apText: '',
  });
  onLoad<'cooperationInvitationDetail'>((op) => {
    id.value = op.id;
    getData();
  });

  const details = ref<DetailsInfo>();
  function getData() {
    if (!id.value) return;
    getCooperationInvitationDetail(id.value).then((r) => (details.value = r));
  }

  const confirmVisible = ref(false);
  const closeVisible = ref(false);
  interface BtnSet {
    confirmText: string;
    cancelText?: string;
    confirmFnc: () => void;
    cancelFnc?: () => void;
  }
  const step = new Map<AuditStatusEnum, () => BtnSet>([
    [
      AuditStatusEnum.UNREVIEWED,
      () => {
        if (details.value?.applyType === ApplyTypeEnum.AUDIT) {
          return {
            confirmText: '同意合作',
            confirmFnc: () => {
              params.apStatus = AuditStatusEnum.PASSED;
              confirmVisible.value = true;
            },
            cancelText: '驳回',
            cancelFnc: () => {
              params.apStatus = AuditStatusEnum.REJECT;
              confirmVisible.value = true;
            },
          };
        } else {
          return {
            confirmText: '取消合作申请',
            confirmFnc: () => {
              params.apStatus = AuditStatusEnum.CLOSE;
              closeVisible.value = true;
            },
          };
        }
      },
    ],
    [
      AuditStatusEnum.CLOSE,
      () => {
        if (details.value?.applyType === ApplyTypeEnum.AUDIT) {
          return {
            confirmText: '',
            confirmFnc: () => {},
          };
        } else {
          return {
            confirmText: '重新申请合作',
            confirmFnc: () => {
              restartInvitation();
            },
          };
        }
      },
    ],
    [
      AuditStatusEnum.PASSED,
      () => {
        return {
          confirmText: '取消合作',
          confirmFnc: () => {
            params.apStatus = AuditStatusEnum.CLOSE;
            closeVisible.value = true;
          },
        };
      },
    ],
    [
      AuditStatusEnum.REJECT,
      () => {
        if (details.value?.applyType === ApplyTypeEnum.AUDIT) {
          return {
            confirmText: '',
            confirmFnc: () => {},
          };
        } else {
          return {
            confirmText: '重新申请合作',
            confirmFnc: () => {
              restartInvitation();
            },
          };
        }
      },
    ],
  ]);
  const getStep = computed(() => {
    return details.value?.apStatus && (step.get(details.value?.apStatus)?.() as BtnSet);
  });

  // 联系秘书处
  const callPhone = function () {
    details.value?.contactsPhone
      ? uni.makePhoneCall({ phoneNumber: details.value.contactsPhone })
      : uni.showToast({
          title: '暂无联系方式',
          icon: 'none',
        });
  };

  function restartInvitation() {
    if (!details.value) return;
    uni.setStorageSync('_CLICK_INFO', details.value);
    addCooperationInvitation(details.value.toTenantId).then((res) => {
      redirectTo({
        name: 'cooperationResult',
        options: { ids: [res.id], type: TabsListValueEnum.QUICK_APLIST },
      });
    });
  }

  // 确认审核 || 取消申请
  const submit = function () {
    if (!id.value) return;
    cooperationInvitationAudit({
      id: id.value,
      apStatus: params.apStatus,
      apText: params.apText,
    }).then((r) => getData());
  };
</script>

<style lang="scss" scoped>
  .cellBox {
    line-height: 60rpx;
    color: #808080;
    font-size: 28rpx;
  }

  .slotBox {
    width: 266rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
</style>
